<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Document</title>
		<style>
			* {
				padding: 0;
				margin: 0;
			}

			div {
				border: 2px solid black;
				padding: 50px;
			}

			.table {
				/*
					展示为表格
				*/
				display: table;
				/* 合并边框 */
				border-collapse: collapse;
			}

			.row {
				/* 以tr的形式呈现 */
				display: table-row;
			}

			.cell {
				/* 以单元格的形式呈现 */
				display: table-cell;
			}


		</style>
	</head>
	<body>

		<div class="table">
			<div class="row">
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
			</div>
			<div class="row">
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
			</div>
			<div class="row">
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
				<div class="cell">单元格</div>
			</div>
		</div>
		
	</body>
</html>